<template>
    <div style="overflow: hidden;background-color: #fff;height: 100vh;width: 100vw;" v-loading="loading">
        <div class="video_title">
            <van-icon name="arrow-left" class="icon" @click="goBack" />
            <p>评价</p>
        </div>
        <div style="height: calc(100vh - 43.5px);overflow-y: auto;overflow-x: hidden;">
            <div v-if="onclass_show.includes(http)">
                <h2 style="margin-top: 12px;padding: 0 12px;">课程评价</h2>
                <div v-for="(item,index) in list" :key="item.id">
                    <div style="display: flex;align-items: center;padding: 15px;font-weight: 600;font-size: 18px;">
                        <p>{{index+1}}、{{ item.lebel }}</p>
                    </div>
                    <div class="item" style="background-color: #ddd;"> 
                        <p>
                            内容
                        </p>
                        <div>得分</div>
                    </div>
                    <div class="item border" v-for="el in item.option" :key="el.id">
                        <p>{{el.lebel}}（{{el.score}}分）</p>
                        <div>
                            <van-stepper v-model="form[el.filed]" step="1"  min="1" :max="el.score"/>
                        </div>
                    </div>
                </div>
                <div class="item" style="font-weight: 600;font-size: 18px;"> 
                    <p>
                        总分
                    </p>
                    <div>{{ score_all }}分</div>
                </div>
            </div>
            <div v-if="teacher_show.includes(http)">
                <h2 style="margin-top: 12px;padding: 0 12px;">教师评价</h2>
                <div class="item border">
                    <p>1、专业能力（40分）</p>
                    <div>
                        <van-stepper v-model="form.专业能力" step="1"  min="1" :max="40"/>
                    </div>
                </div>
                <div class="item border">
                    <p>2、备课情况（30分）</p>
                    <div>
                        <van-stepper v-model="form.备课情况" step="1"  min="1" :max="30"/>
                    </div>
                </div>
                <div class="item border">
                    <p>3、讲课技巧（30分）</p>
                    <div>
                        <van-stepper v-model="form.讲课技巧" step="1"  min="1" :max="30"/>
                    </div>
                </div>
                <div class="item" style="font-weight: 600;font-size: 18px;"> 
                    <p>
                        总分
                    </p>
                    <div>{{ score_all_teacher }}分</div>
                </div>
            </div>
            <div style="padding: 15px;">
                <van-button type="primary" block size="small" @click="commit">提交</van-button>
            </div>
        </div>
    </div>
  </template>
<script>
import exports from '@/components/exports.vue';
import { downImg } from "@/utils/downloadImg.js";
import { download } from "@/api/download.js";
import { evaluationTeacherLog,evaluationLog,evaluationTeacherList,evaluationLogList} from "@/api/admin.js";
import {
  getGZ,getsubjectTitle,getapplyid
} from "@/utils/auth.js";
export default {
    components:{exports},
    data () {
        return {
            loading:false,
            activeKey:1,
            value:'',
            columns:[],
            show:false,
            round_str:[],//教学范围
            list:[],
            userInfo:{},
            TCshow:false,
            TCshowImg:false,
            downloadURL:'',
            form:{},
            score_all:0,
            score_all_teacher:0,
            http:
            process.env.NODE_ENV === "development"
            ? process.env.VUE_APP_BASE_API.split('://')[1].split('.')[0]
            : window.location.origin.split('://')[1].split('.')[0],

            teacher_show:['kmjd','qiye'],  //教师评价
            onclass_show:['sdtjy','jyhc','qiye','kmjd','jtlzy'], // 课程评价
        }
    },
    watch: {
        form:{
            deep:true,
            handler(value){
                this.score_all=0
                this.score_all_teacher=0
                let arr = [].concat.apply([], JSON.parse(JSON.stringify(this.list)).map(item=>item.option))
                arr.map(item=>{
                    this.score_all +=value[item.filed]
                })
                this.score_all_teacher = (value.专业能力+value.备课情况+value.讲课技巧) 
            }
        },
    },
    created () {
        // huacong
        this.changeActive()
        // this.userInfo=JSON.parse(this.$route.query.list)
    },
    methods: {
        goBack(){
            this.$router.go(-1)
        },
        changeActive(){
            this.list = [
                {
                    id:10010,
                    lebel:'课程目标',
                    option:[
                        {
                            id:1,
                            lebel:'课程培训目标清晰度、完整度。',
                            score:10,
                            filed:'a',
                        },
                        {
                            id:2,
                            lebel:'课程培训目标与培训需求的契合度。',
                            score:10,
                            filed:'b',
                        },
                    ],
                },
                {
                    id:10012,
                    lebel:'课程内容',
                    option:[
                        {
                            id:3,
                            lebel:'课程内容设计与参训者岗位职责及知识背景的符合度。',
                            score:10,
                            filed:'c',
                        },
                        {
                            id:4,
                            lebel:'课程内容的深度、广度和容量对培训目标的达成度。',
                            score:10,
                            filed:'d',
                        },
                        {
                            id:5,
                            lebel:'课程内容的各专题安排顺序符合学院的思维逻辑和学习习惯程度。',
                            score:10,
                            filed:'e',
                        },
                    ],
                },
                {
                    id:10015,
                    lebel:'课程结构',
                    option:[
                        {
                            id:6,
                            lebel:'核心课程重点突出。',
                            score:10,
                            filed:'f',
                        },
                        {
                            id:7,
                            lebel:'现场教学、研讨交流、视频教学安排合理。',
                            score:10,
                            filed:'g',
                        },
                    ],
                },
                {
                    id:10017,
                    lebel:'课程效果',
                    option:[
                        {
                            id:8,
                            lebel:'培训课程对更新、扩充学员专业知识结构的针对性。',
                            score:10,
                            filed:'h',
                        },
                        {
                            id:9,
                            lebel:'培训课程对提升学员工作履职能力的实用性。',
                            score:10,
                            filed:'i',
                        },
                        {
                            id:10,
                            lebel:'培训课程对拓宽学员视野、启发思维的新颖性。',
                            score:10,
                            filed:'j',
                        },
                    ],
                },
            ]
            let arr = [].concat.apply([], JSON.parse(JSON.stringify(this.list)).map(item=>item.option))
            this.$nextTick(()=>{
                arr.map(item=>{
                    this.form[item.filed] = item.score
                })
                this.form.专业能力 = this.form.备课情况 = this.form.讲课技巧 = 20
            })
            this.$forceUpdate()
            this.score_all=100
            this.score_all_teacher=60
        },
        async commit(){
            let isYes = true
            if(this.teacher_show.includes(this.http)){
                await evaluationTeacherList({applyid:getapplyid()}).then(res=>{
                    if(res.code==200&&res.data.list.length==0){
                        isYes=true
                    }else{
                        isYes = false
                    }
                })
            }
            if(this.onclass_show.includes(this.http)){
                await evaluationLogList({applyid:getapplyid()}).then(res=>{
                    if(res.code==200&&res.data.list.length==0){
                        isYes=true
                    }else{
                        isYes = false
                    }
                })
            }
            if (!isYes) {
                return this.$toast.fail('您已提交过评价,不能再次提交.')
            }
            let a = JSON.parse(JSON.stringify(this.form))
            let form
            let formA
            if(this.onclass_show.includes(this.http)){
                let arr = [].concat.apply([], JSON.parse(JSON.stringify(this.list)).map(item=>item.option)).map(item=>{
                    // if(this.score_all<90){
                    //     const num = Math.floor(Math.random()*(10-9)+9)
                    //     a[item.filed] = num
                    // }
                    return {
                        id:item.id,
                        score:a[item.filed]
                    }
                })
                form = {
                    applyid:getapplyid(),
                    course_score:JSON.stringify(arr),
                }
                evaluationLog(form).then(res=>{
                    if(res.code==200){
                        this.$toast.success(res.msg)
                    }else{
                        this.$toast.fail(res.msg)
                    }
                })
            }
            if(this.teacher_show.includes(this.http)){
                formA = {
                    applyid:getapplyid(),
                    teacher:'',
                    teacher_score:JSON.stringify([
                        {
                            id:1,
                            score:a.专业能力
                        },
                        {
                            id:2,
                            score:a.备课情况
                        },
                        {
                            id:3,
                            score:a.讲课技巧
                        },
                    ]),
                }
                evaluationTeacherLog(formA).then(res=>{
                    if(res.code==200){
                        this.$toast.success(res.msg)
                    }else{
                        this.$toast.fail(res.msg)
                    }
                })
            }
            // console.log(formA);
            // return 
            
        },
        changeFen(filed,data){
            // console.log(this.form,data,'6677878');
            // this.form[filed] = data
            this.$forceUpdate();
        }
    }
}
</script>

<style lang="scss" scoped>
p{
    margin: 0;
}
.video_title {
  display: flex;
  align-items: center;
  padding: 0 12px;
  background: #327bff;
  color: #fff;
  height: 2.75rem;
   
  p {
    margin: 0;
    width: calc(100vw - 64px);
    display: flex;
    justify-content: center;
  }
  .icon {
    font-size: 1.25rem;
  }
}
.item{
    display: flex;align-items: center;justify-content: space-between;padding: 12px 24px;
    p{
        flex: 2;
        text-align: center;
    }
    div{
        flex: 1;
        text-align: center; 
    }
}
.border{
    border-bottom: 1px solid #ccc;
}
</style>